<template>
    <div class="left">
        <div>echarts动态改造已经用上了，但是想换种写法，等另一种写好一起发出来。</div>
        <div>所以这个页面其实还没实现二次封装（。</div>
        <div><del>但是反正也没人看，鸽了也没关系吧。</del></div>
    </div>
    <div>
        <pie-chart :uuid="createUUID()"></pie-chart>
        <pie-chart :uuid="createUUID()"></pie-chart>
    </div>
</template>

<script lang="ts">
import { defineComponent } from "vue";
import PieChart from "@/components/PieChart.vue";
export default defineComponent({
    name: "echartData",
    components: {
        PieChart,
    },
    data() {
    },
    mounted() {
        // let s:string=createUUID();
        // console.log();
    },
    methods: {
        createUUID() {
            let uuid = this.guid();
            console.log(uuid)
            return uuid;
        },
        S4() {
            return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1);
        },
        guid() {
            return (this.S4() + this.S4() + "-" + this.S4() + "-" + this.S4() + "-" + this.S4() + "-" + this.S4() + this.S4() + this.S4());
        }
    }
});
</script>

<style>
.left{
    text-align:left;
    margin-bottom:20px;
}
.left>div:nth-child(2){
    color:#707070;
}
.left>div:nth-child(3){
    color:#9c9c9c;
}
</style>